/*
selector {propiedad:valor;}
*/

@import url('https://fonts.googleapis.com/css2? family = Comfortaa: wght @ 300 & display = swap');




/* estilos header */

.encabezado {width: 100%;}
h1 {font-family:'Comfortaa', sans-serif; font-weight: 700 ;font-size: 3rem; color:#F16100;}
header{background:#D1EBEA; margin-block-end: 0%;}
body {text-align: center; padding: 0%;}
nav ul {padding: 0%; background-color: #D1EBEA;padding-block-end: 1rem; font-family: 'Comfortaa', serif; font-weight:400; font-size: 1rem; text-align: center; list-style: none;}
nav ul li {margin: 2%; padding: 2%;text-align: center; background:#45537F;}
nav ul li:hover {background: #76B3BC;}
nav ul li a{padding-right: 3rem; padding-left: 3rem; text-decoration: none; color: white;}

.activo {background:#F16100; color: white;}
.activo:hover {background-color:#76B3BC;}



/*estilos body */
section {  padding-top: 4rem;padding-block-end: 4rem;margin-top: 0%;}
.titulo1 { color: #F16100; font-family:'Comfortaa', sans-serif; font-weight: 700; font-size: 2rem; margin-block-end: 1rem; margin-top: 0%; padding-block-end: 2rem;}
.figma {width: 300px; height: 350px;}


/* estilos footer */
footer {background-color:#F16100 ; padding-top: 2rem; padding-block-end: 2rem; padding-right: 1.5rem; padding-left: 1.5rem;}
footer p{color: white; font-family:'Comfortaa', serif; ;font-weight: 400;font-size: 0.6rem;}
footer a {color: #D1EBEA; font-family:'Comfortaa', serif; ;font-weight: 400;font-size: 1rem; text-decoration: none; }
footer a:hover {color: #76B3BC;}




@media (min-width:576px) { 

	header {margin: 0%;}
	h1 {padding-top: 1.5rem; }

    nav ul {padding-block-end: 1rem; font-family: 'Comfortaa', serif; font-weight:400; font-size: 1.2rem; text-align: center; list-style: none; margin: 0%;}
    nav ul li { list-style: none; display: inline-block; padding-block-end: 1rem; padding-block-start: 1rem; margin-left: 0.1rem; margin-right: 0.1rem;
        padding-right: 3.5rem; padding-left: 3.6rem;}
    nav ul li:hover {background: #76B3BC;}


    section {  padding-top: 8rem;padding-block-end: 8rem;}
    .titulo1 {  font-size: 3rem; margin-block-end: 2.5rem; margin-top: 0%;}
/* estilos figma */
.figma {width: 800px; height: 450px;}

footer{background: #F16100; text-align: center; padding-block-start: 2rem; padding-block-end: 2rem; }
footer p{color: white; font-family:'Comfortaa', serif; ;font-weight: 400;font-size: 0.8rem; line-height:1.3rem ;}footer a {color: white; font-family:'Comfortaa', serif; ;font-weight: 400;font-size: 1rem; text-decoration: none; }
footer a:hover {color: #45537F}


 }